<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>待指派服务</title>
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link href="../../../css/global.css" rel="stylesheet" />
		<link href="../../../css/style.css" rel="stylesheet" />
		<link href="../../../css/mui.picker.css" rel="stylesheet" />
		<link href="../../../css/mui.poppicker.css" rel="stylesheet" />
		<link href="../../../css/task.css" rel="stylesheet" />
		<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mescroll.js@1.4.1/mescroll.min.css"> -->
		<style>
			.d_int_tp{
				border: 0 !important;
				margin-top: 6px !important;
			}
			.details_con .btm .selectBtn {
			    line-height: 28px;
			    color: #ffffff;
			    background: #ea1e1a;
			}
			.item_box .item .text span.cen{
				color: #333;
				margin-left:0;
			}
			.item_box .item .text span{
				width: auto;
			}
			.select-tzstate{
				width: 100%;
				border: 0;
				color: #a9a9a9;
				font-size: 16px;
				text-align: left;
				padding: 15px;
			}
			.mui-bar-nav{
				box-shadow: 0 1px 6px #ea1e1a;
			}
			.mescroll{
				position: fixed;
				top: 240px;
				bottom: 0;
				height: auto; /*如设置bottom:50px,则需height:auto才能生效*/
			}
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 id="title" class="mui-title">待指派服务</h1>
		</header>
		<div class="mui-content">
			<div class="details_con select_con" id="search">
				<div class="clum">
					<input type="text" class="d_int_tp" id="customerName" placeholder="输入客户名称" />
				</div>
				<div class="clum">
					<span class="txt" style="width: 100%;">
						<input type="hidden" id="serviceTypeValue" />
						<button id="serviceType" class="mui-btn mui-btn-block mui-btn-select select-tzstate" type="button">请选择服务子类型</button>
					</span>
				</div>
				<div class="clum">
					<input type="text" class="d_int_tp" id="instrumentSerialNumber" placeholder="输入仪器序列号" />
				</div>
				<div class="btm autoHeight">
					<p class="selectBtn" id="searchBtn" onclick="initData()">查 询</p>
				</div>
			</div>
			<div class="details_con" style="margin: 30px 0 0 0;">
				<div class="item_box" id="itemBox"></div>
				<div style="height: 50px;"></div>
			</div>
		</div>
		<!-- 基础js start -->
		<script src="../../../js/mui.min.js"></script>
		<script src="../../../js/utils/h.js"></script>
		<script src="../../../js/constant.js"></script>
		<script src="../../../js/common.js"></script>
		<script src="../../../js/utils/base64.js"></script>
		<script src="../../../js/utils/md5.js"></script>
		<script src="../../../js/utils/sortMap.js"></script>
		<script src="../../../js/utils/http.js"></script>
		<script src="../../../js/app.js"></script>
		<!-- 基础js end -->
		<script src="../../../js/mui.picker.js"></script>
		<script src="../../../js/mui.poppicker.js"></script>
		<!-- <script src="https://cdn.jsdelivr.net/npm/mescroll.js@1.4.1/mescroll.min.js" charset="utf-8"></script> -->
		<script type="text/javascript" charset="utf-8">
			// var mescroll = new MeScroll("itemBox", { //第一个参数"mescroll"对应上面布局结构div的id (1.3.5版本支持传入dom对象)
			// 	//如果您的下拉刷新是重置列表数据,那么down完全可以不用配置,具体用法参考第一个基础案例
			// 	//解析: down.callback默认调用mescroll.resetUpScroll(),而resetUpScroll会将page.num=1,再触发up.callback
			// 	up: {
			// 		callback: upCallback, //上拉加载的回调
			// 		page: {
			// 			num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
			// 			size: 10 //每页数据条数,默认10
			// 		},
			// 		htmlNodata: '<p class="upwarp-nodata">-- END --</p>',
			// 		noMoreSize: 5, //如果列表已无数据,可设置列表的总数量要大于5才显示无更多数据;
			// 		empty: {
			// 			//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
			// 			warpId:	"itemBox", //父布局的id (1.3.5版本支持传入dom元素)
			// 			icon: "../img/mescroll-empty.png", //图标,默认null,支持网络图
			// 			tip: "暂无相关数据~" //提示
			// 		},
			// 		//以下是一些常用的配置,当然不写也可以的.
			// 	}
			// });

			(function($, doc) {
				$.init();
				$.plusReady(function() {
					var self = plus.webview.currentWebview();
					initData()
					// 服务子类型下拉
					h('#serviceType').tap(function() {
						var userPicker = new $.PopPicker();
						ajaxGetJson(BASE_URL + 'cc/dict/selectCCDict', {
							tableName: 'snsubtype',
							engineerId: app.getUser().enginnerId
						}, function(data) {
							if (!data) {
								app.toast("无下拉内容")
								return
							}
							// 数组指定位置插入数据
							data.splice(0, 0, {
								"text": "请选择服务子类型",
								"value": ""
							});
							userPicker.setData(data);
							userPicker.show(function(items) {
								h('#serviceType').html(items[0].text)
								h('#serviceTypeValue').val(items[0].value)
								userPicker.dispose()
							});
						});
					});
					
					h('.mui-action-back').tap(function () {
						var noticeMenu=plus.webview.getWebviewById('view/service/notice/noticeMenu.html');
						if(noticeMenu){
							noticeMenu.evalJS('getNoticeCount()')
						}
						var indexTl=plus.webview.getWebviewById('view/main/indexTL.html');
						if(indexTl){
						    indexTl.evalJS('getMyTeamCount()')
						}
					})
				});
			}(mui, document));

			function initData() {
				app.showWaiting('加载中...')
				var customerName = h("#customerName").val();
				var serviceType = h("#serviceType").html();
				if (serviceType == '请选择服务子类型') {
					serviceType = ""
				}
				var instrumentSerialNumber = h("#instrumentSerialNumber").val();
				ajaxGet(BASE_URL + "cc/notice/getAssignServiceNotice", {
					"enginnerId": app.getUser().enginnerId,
					"state": 1,
					"customerName": customerName,
					"serviceType": serviceType,
					"instrumentSerialNumber": instrumentSerialNumber
				}, function(data) {
					app.closeWaiting()
					if (data.code === 200) {
						var str = '';
						if (data.data && data.data.length > 0) {
							for (var c = 0; c < data.data.length; c++) {
								/* var xianshi = '';
								var enginnerType = data.data[c].enginnerType == undefined ? "" : data.data[c].enginnerType;
								var isVip = data.data[c].isVip == undefined ? "" : data.data[c].isVip;
								var userIsdpel = data.data[c].userIsdpel == undefined ? "" : data.data[c].userIsdpel;
								if (userIsdpel == '1') {
									xianshi = ''
								}
								if (isVip != '') {
									xianshi += isVip
								} else {
									if (enginnerType != '') {
										xianshi += enginnerType
									}
								} */
								
								var enginnerType = data.data[c].enginnerType ? data.data[c].enginnerType : "";
								var customerName = data.data[c].customerName ? data.data[c].customerName : "";
								var createTime = data.data[c].createTime ? data.data[c].createTime : "";
								var serviceType = data.data[c].subServiceType ? data.data[c].subServiceType : "";
								str += '<div class="item" onclick="tiaozhuan(' + data.data[c].id + ',' + data.data[c].serviceNo + ')">';
								str += '<div class="bar">';
								str += '<span class="number"><img src="../../../images/icon_204.png" />' +
									data.data[c].serviceNo + '</span>';
								str += '<span class="vip">' + enginnerType + '</span>';
								str += '</div>';
								str += '<div class="text autoHeight">';
								str += '<span class="cen">' + customerName + '</span>';
								str += '</div>';
								str += '<div class="type">';
								str += '<p><img src="../../../images/icon_202.png"/><span class="lpl">提交时间：</span><span>' + createTime +
									'</span></p>';
								str += '<p><img src="../../../images/icon_203.png"/><span class="lpl">服务子类型：</span><span>' + serviceType +
									'</span></p>';
								var hopeBusinessHours = data.data[c].hopeBusinessHours ? data.data[c].hopeBusinessHours : "";
								str += '<p><img src="../../../images/icon_202.png"/><span class="lpl">期望服务时间：</span><span>' + hopeBusinessHours + '</span></p>';
								str += '</div>';
								str += '</div>';
							}
							h('#itemBox').html(str);
						} else {
							var html = '<div class="nodata">—— 暂无数据 ——</div>';
							h("#itemBox").html(html);
						}
					} else {
						var html = '<div class="nodata">—— 暂无数据 ——</div>';
						h("#itemBox").html(html);
						app.toast(data.msg)
					}
				}, function(errorMsg) {
					app.closeWaiting();
					var html = '<div class="nodata">—— 暂无数据 ——</div>';
					h("#itemBox").html(html);
					app.toast("数据获取失败，请检查网络连接");
				});
			}

			//上拉加载的回调 page = {num:1, size:10}; num:当前页 默认从1开始, size:每页数据条数,默认10
			// function upCallback(page) {
			// 	console.log(page)
			// var pageNum = page.num; // 页码, 默认从1开始 如何修改从0开始 ?
			// var pageSize = page.size; // 页长, 默认每页10条
			// $.ajax({
			// 	url: 'xxxxxx?num=' + pageNum + "&size=" + pageSize,
			// 	success: function(data) {
			// 		var curPageData = data.xxx; // 接口返回的当前页数据列表
			// 		var totalPage = data.xxx; // 接口返回的总页数 (比如列表有26个数据,每页10条,共3页; 则totalPage值为3)
			// 		var totalSize = data.xxx; // 接口返回的总数据量(比如列表有26个数据,每页10条,共3页; 则totalSize值为26)
			// 		var hasNext = data.xxx; // 接口返回的是否有下一页 (true/false)

			// 		//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
			// 		//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空,显示empty配置的内容;
			// 		//列表如果无下一页数据,则提示无更多数据,(注意noMoreSize的配置)

			// 		//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			// 		//必传参数(当前页的数据个数, 总页数)
			// 		//mescroll.endByPage(curPageData.length, totalPage);

			// 		//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
			// 		//必传参数(当前页的数据个数, 总数据量)
			// 		//mescroll.endBySize(curPageData.length, totalSize);

			// 		//方法三(推荐): 您有其他方式知道是否有下一页 hasNext
			// 		//必传参数(当前页的数据个数, 是否有下一页true/false)
			// 		//mescroll.endSuccess(curPageData.length, hasNext);

			// 		//方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.
			// 		//如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据
			// 		//如果传了hasNext,则翻到第二页即可显示无更多数据.
			// 		//mescroll.endSuccess(curPageData.length);

			// 		//curPageData.length必传的原因:
			// 		1. 使配置的noMoreSize 和 empty生效
			// 		2. 判断是否有下一页的首要依据: 
			// 		   当传的值小于page.size时(说明不满页了),则一定会认为无更多数据;
			// 		   比传入的totalPage, totalSize, hasNext具有更高的判断优先级;
			// 		3. 当传的值等于page.size时,才会取totalPage, totalSize, hasNext判断是否有下一页
			// 		传totalPage, totalSize, hasNext目的是避免方法四描述的小问题

			// 		//设置列表数据
			// 		//setListData(curPageData);//自行实现 TODO
			// 	},
			// 	error: function(e) {
			// 		//联网失败的回调,隐藏下拉刷新和上拉加载的状态
			// 		mescroll.endErr();
			// 	}
			// });
			// }

			function tiaozhuan(ServiceNoticeId, serviceNo) {
				app.jumpTo("/view/service/assign/details.html", "view/service/assign/details.html", {
					ServiceNoticeId: ServiceNoticeId,
					serviceNo: serviceNo
				});
			}
		</script>
	</body>
</html>